/**
 * Copyright (c) 2012-2018 Red Hat, Inc.
 * All rights reserved. This program and the accompanying materials
 * are made available under the terms of the Eclipse Public License v1.0
 * which accompanies this distribution, and is available at
 * http://www.eclipse.org/legal/epl-v10.html
 *
 * Contributors:
 *   Red Hat, Inc. - initial API and implementation
 */
@external .gwt-SplitLayoutPanel-HDragger, .gwt-SplitLayoutPanel-VDragger, .hsplitter, .hsplitter, .gwt-DialogBox, .gwt-Button, .gwt-PushButton, gwt-PushButton-up, gwt-PushButton-up-hovering, gwt-PushButton-up-disabled, gwt-PushButton-down,.gwt-PushButton-down-hovering,.gwt-PushButton-down-disabled, gwt-ToggleButton, gwt-ToggleButton-up, gwt-ToggleButton-up-hovering, gwt-ToggleButton-up-disabled, gwt-ToggleButton-down, .gwt-ToggleButton-down-hovering, .gwt-ToggleButton-down-disabled, .gwt-TextBox, .inputError, .gwt-TextArea, .gwt-ListBox, .gwt-PopupPanel, .gwt-Label;

@eval inputSelectionBackground org.eclipse.che.ide.api.theme.Style.theme.inputSelectionBackground();

/* Global styles and external GWT styles. */

body, td, th {
    font-size: 13px;
    font-family: mainFontFamily;
    color: mainFontColor;
    -moz-user-select: -moz-none;
    -webkit-user-select: none;
    user-select: none;

    /* We turn off document level scrolling all together for the outer page. */
    overflow: hidden;
}

input::selection {
    background-color: inputSelectionBackground !important;
}

/* We must override the user agent stylesheet which sets textarea font to monospace. */

.gwt-Label {
    margin-bottom: 6px;
    color: textFieldTitleColor;
    font-size: textFieldFontSize;
    font-family: textFieldFontFamily;
}

.gwt-ListBox {
    background-color: textFieldBackgroundColor;
    border: 1px solid textFieldBorderColor;
    font-size: textFieldFontSize;
    color: listBoxColor;
    padding-left: 5px;
    border-radius: 0;
    min-height: 22px;
    outline: none;
}

.gwt-ListBox[disabled] {
    background-color: listBoxDisabledBackgroundColor;
    color: listBoxDisabledColor;
}

.gwt-CheckBox {
    display: inline-block;
    position: relative;
    height: 14px;
}

.gwt-CheckBox label {
    position: relative;
    top: 0;
    left: 0;
    float: left;
    font-weight: bold;
    white-space: nowrap;
    line-height: inherit;
    color: checkBoxFontColor;
    font-size: fontSize;
}

.gwt-CheckBox input {
    position: absolute;
    visibility: hidden;
}

.gwt-CheckBox label::before {
    position: relative;
    content: " ";
    float: left;
    left: 0;
    top: 0;
    width: 12px;
    height: 12px;
    line-height: 12px;
    text-align: center;
    margin-right: 5px;
    border-radius: 2px;
    border: 1px solid checkBoxBorderColor;
    background-color: checkBoxBackgroundColor;
}

.gwt-CheckBox input:checked + label::before {
    content: "\2714";
    font-size: 14px;
    font-weight: normal;
    color: checkBoxIconColor;
}

.gwt-CheckBox input:indeterminate + label::before {
    content: "\2714";
    font-size: 14px;
    font-weight: normal;
    color: checkBoxIndeterminateIconColor;
}

.gwt-CheckBox input[disabled] + label {
    color: checkBoxDisabledFontColor;
}

.gwt-CheckBox input[disabled] + label::before {
    background-color: checkBoxDisabledBackgroundColor;
    color: checkBoxDisabledIconColor !important;
}

.gwt-RadioButton {
    float: left;
    margin: 1px;
    height: 14px;
    line-height: 14px;
    position: relative;
}

.gwt-RadioButton label {
    position: relative;
    top: 0;
    left: 0;
    cursor: pointer;
    padding-left: 10px;
    font-weight: bold;
    font-size: fontSize;
    color: radioButtonFontColor;
}

.gwt-RadioButton input {
    position: absolute;
    visibility: hidden;
}

.gwt-RadioButton input + label::before {
    position: relative;
    content: " ";
    float: left;
    top: 2px;
    left: 1px;
    width: 8px;
    height: 8px;
    border-radius: 6px;
    background: radioButtonBackgroundColor;
    border: 2px solid radioButtonBackgroundColor;
    box-shadow: 0 0 0 .5px radioButtonBorderColor;
}

.gwt-RadioButton input:checked + label::before {
    background: radioButtonIconColor;
}

.gwt-RadioButton input[disabled] + label {
    color: radioButtonDisabledFontColor;
}

.gwt-RadioButton input[disabled] + label::before {
    background: radioButtonDisabledBackgroundColor;
    border-color: radioButtonDisabledBackgroundColor;
}

.gwt-RadioButton input[disabled]:checked + label::before {
    background: radioButtonDisabledIconColor;
}

.gwt-TextBox,
.gwt-TextArea,
.gwt-SuggestBox,
.gwt-PasswordTextBox {
    outline: none;
    border-radius: 0;
    box-shadow: none;
    text-align: start;
    color: textFieldColor;
    background-color: textFieldBackgroundColor;
    border: 1px solid textFieldBorderColor;
    font-size: textFieldFontSize;
    font-family: textFieldFontFamily;
}

.gwt-TextBox {
    min-height: 22px;
    padding: 0 5px 0 5px;
    transition: border-bottom 0.2s linear;
}

.gwt-TextArea {
    min-height: 40px;
    padding: 5px;
    resize: none;
}

.gwt-TextBox[success] {
    border-bottom: 1px solid successColor;
}

.gwt-TextBox:invalid,
.gwt-TextBox:required,
.gwt-TextBox.inputError,
.gwt-TextBox[error] {
    border-bottom: 1px solid errorColor !important;
}

.gwt-TextBox:focus,
.gwt-TextArea:focus,
.gwt-SuggestBox:focus,
.gwt-PasswordTextBox:focus {
    color: textFieldFocusedColor;
    background-color: textFieldFocusedBackgroundColor;
    -webkit-text-fill-color: textFieldFocusedColor;
    -webkit-animation: textFieldFocus 0.2s infinite;
}

.gwt-TextBox-readonly:focus {
    border-bottom: 1px solid textFieldBorderColor;
}

.gwt-TextBox:focus::-webkit-input-placeholder,
.gwt-TextArea:focus::-webkit-input-placeholder,
.gwt-SuggestBox:focus::-webkit-input-placeholder,
.gwt-PasswordTextBox:focus::-webkit-input-placeholder {
    -webkit-text-fill-color: textFieldDisabledColor;
}

@-webkit-keyframes textFieldFocus {
    from {
        color: #4eabff;
    }
    to {
        color: #4eabff;
    }
}

.gwt-TextBox[disabled],
.gwt-TextArea[disabled],
.gwt-SuggestBox[disabled],
.gwt-PasswordTextBox[disabled] {
    color: textFieldDisabledColor;
    background-color: textFieldDisabledBackgroundColor;
}

.gwt-Button, button {
    height: buttonHeight;
    line-height: buttonLineHeight;
    min-width: buttonMinWidth;
    padding: 0px buttonPadding;
    outline: none;
    font-size: buttonFontSize;
    font-family: mainFontFamily;
    background: buttonBackground;
    border: 1px solid buttonBorderColor;
    color: buttonFontColor;
    border-radius: 0px;
}

.gwt-Button:hover, button:hover {
    background: buttonHoverBackground;
    border: 1px solid buttonHoverBorderColor;
    color: buttonHoverFontColor;
}

button[disabled], button[disabled]:hover, button[disabled]:active,
.gwt-Button[disabled], .gwt-Button[disabled]:hover, .gwt-Button[disabled]:active {
    background: buttonDisabledBackground;
    border: 1px solid buttonDisabledBorderColor;
    color: buttonDisabledFontColor;
}

.gwt-Button:active, button:active {
    background: buttonClickedBackground;
    border: 1px solid buttonClickedBorderColor;
    color: buttonClickedFontColor;
    outline: none;
}

*::-moz-focus-inner {
    border: 0;
}

.gwt-PushButton, .gwt-ToggleButton {
    font-family: mainFontFamily;
}

.gwt-PushButton-up, .gwt-ToggleButton-up {
    color: mainFontColor;
    border-radius: 1px;
    border: 1px solid tabBorderColor;
    font-weight: 700;
    background: linear-gradient(to bottom, buttonTopColor 0%, buttonTopColor 3%, buttonColor 4%, buttonColor 100%);
}

.gwt-PushButton-up-hovering, .gwt-ToggleButton-up-hovering {
    border: 1px solid tabBorderColor;
    background: linear-gradient(to bottom, buttonTopColor 0%, buttonTopColor 3%, buttonColor 4%, buttonColor 100%);
    font-weight: 700;
    color: buttonHoverTextColor;
    background: linear-gradient(to bottom, buttonColor 0%, buttonColor 3%, buttonHoverColor 4%, buttonHoverColor 100%);
}

.gwt-PushButton-up-disabled, .gwt-ToggleButton-up-disabled {

}

.gwt-PushButton-down, .gwt-ToggleButton-down {
    color: mainFontColor;
    border-radius: 1px;
    border: 1px solid tabBorderColor;
    font-weight: 700;
    background: linear-gradient(to bottom, buttonTopColor 0%, buttonTopColor 3%, buttonColor 4%, buttonColor 100%);
    box-shadow: 0 0 4px 2px selectionBackground;
    border-radius: 1px;
    outline: none;
}

.gwt-PushButton-down-hovering, .gwt-ToggleButton-down-hovering {
    color: buttonHoverTextColor;
    background: linear-gradient(to bottom, buttonColor 0%, buttonColor 3%, buttonHoverColor 4%, buttonHoverColor 100%);
    border-radius: 1px;
    border: 1px solid tabBorderColor;
    font-weight: 700;
    box-shadow: 0 0 4px 2px selectionBackground;
    outline: none;
}

.gwt-PushButton-down-disabled, .gwt-ToggleButton-down-disabled {
    box-shadow: 0 0 0px 0px selectionBackground;
    border-radius: 1px;
    outline: none;
    color: #888888;
}

.gwt-ToggleButton-up-disabled > svg, .gwt-PushButton-up-disabled > svg,
.gwt-ToggleButton-down-disabled > svg, .gwt-PushButton-down-disabled > svg {
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    fill: #9B9B9B;
}

.gwt-ToggleButton-up > svg, .gwt-PushButton-up > svg,
.gwt-ToggleButton-up-hovering > svg, .gwt-PushButton-up-hovering > svg,
.gwt-ToggleButton-down > svg, .gwt-PushButton-down > svg,
.gwt-ToggleButton-down-hovering > svg, .gwt-PushButton-down-hovering > svg {
    fill: mainFontColor;
}

/* Style for splitter */
.gwt-SplitLayoutPanel-HDragger {
    cursor: col-resize;
}

.gwt-SplitLayoutPanel-VDragger {
    cursor: row-resize;
}

.gwt-DialogBox {
    box-shadow: 0 0 6px 1px tabBorderColor;
}

.hsplitter, .gwt-SplitLayoutPanel-HDragger {
    background: tabBorderColor; /*Old browsers */
}

.vsplitter, .gwt-SplitLayoutPanel-VDragger {
    background: tabBorderColor; /*Old browsers */
}

#talk_roster {
    display: none;
}

a {
    outline: none;
}

.editorPaneMenuDelimiter {
    cursor: default;
}

.editorPaneMenuDelimiter {
    width: 100%;
    height: 1px;
    background-color: popupBorderColor;
}

.simpleListContainer {
    border: 1px solid rgba(0, 0, 0, 0.2);
}

.mainText {
    font-family: mainFontFamily;
}

.mainFont {
    cursor: default;
    font-family: mainFontFamily;
    font-size: fontSize;
    font-style: normal;
    font-weight: normal;
}

.mainBoldFont {
    cursor: default;
    font-family: mainFontFamily;
    font-size: fontSize;
    font-style: normal;
    font-weight: bold;
}

.errorFont {
    cursor: default;
    font-family: mainFontFamily;
    font-size: fontSize;
    font-style: normal;
    font-weight: normal;
    color: #d21a1a;
}

.greyFontColor {
    color: #888888;
}

.defaultFont {
    font-family: mainFontFamily;
    font-size: fontSize;
    color: inherit;
}

.warningFont {
    font-family: mainFontFamily;
    font-size: fontSize;
    color: #d26a11;
}

.cursorPointer {
    cursor: pointer;
}

.line {

}

div[name="linkWithEditor"][activated="true"]  i {
    color: blueIconColor;
}

.gwt-PopupPanel {
    color: mainFontColor;
    border: 1px solid tabBorderColor;
    border-radius: 3px;
    background-color: partBackground;
    z-index: 7;
}

/* Style for SuggestBox */
.gwt-SuggestBoxPopup {
    z-index: 90000;
}

.gwt-SuggestBoxPopup .suggestPopupTopLeft {
    background: dialogTopLeft url("");
}

.gwt-SuggestBoxPopup .suggestPopupTopLeftInner {
    width: 1px;
    height: 1px;
}

.gwt-SuggestBoxPopup .suggestPopupTopCenter {
    background: dialogTopCenter url("");
}

.gwt-SuggestBoxPopup .suggestPopupTopRight {
    background: dialogTopRight url("");
}

.gwt-SuggestBoxPopup .suggestPopupTopRightInner {
    width: 1px;
    height: 1px;
}

.gwt-SuggestBoxPopup .suggestPopupMiddleLeft {
    background: dialogMiddleLeft url("");
}

.gwt-SuggestBoxPopup .suggestPopupContent {
    background-color: partBackground;
}

.gwt-SuggestBoxPopup .suggestPopupMiddleRight {
    background: dialogMiddleRight url("");
}

.gwt-SuggestBoxPopup .suggestPopupBottomLeft {
    background: dialogBottomLeft url("");
}

.gwt-SuggestBoxPopup .suggestPopupBottomLeftInner {
    width: 1px;
    height: 1px;
}

.gwt-SuggestBoxPopup .suggestPopupBottomCenter {
    background: dialogBottomCenter url("");
}

.gwt-SuggestBoxPopup .suggestPopupBottomRight {
    background: dialogBottomRight url("");
}

.gwt-SuggestBoxPopup .suggestPopupBottomRightInner {
    width: 1px;
    height: 1px;
}

.gwt-SuggestBoxPopup .item {
    color: textFieldColor;
}

.gwt-SuggestBoxPopup .item-selected {
    background-color: keyboardSelectionBackgroundColor;
}

.gwt-DisclosurePanel .header td {
    color: mainFontColor;
    font-size: 11px;
    font-weight: bold;
    font-family: textFieldFontFamily;
}

.gwt-DisclosurePanel .header td img {
    width: 12px;
    height: 12px;
    margin-top: 5px;
}

.gwt-DisclosurePanel .content {
    margin-left: 24px;
    border: none;
}

.editorFullScreen {
    fill: #e7e7e7;
    width: 15px;
    height: 15px;
    margin: 3px 2px;
    background: #515151;
    border: 1px solid #000000;
    padding: 1px;
    cursor: pointer;
    position: relative;
}

.editorFullScreen div {
    width: 15px;
    height: 15px;
    position: absolute;
    left: 1px;
    top: 1px;
    z-index: 9999;
    font-size: 14px;
    line-height: 15px;
    text-align: center;
}

.editorFullScreen:hover {
    background: #202020;
    color: #ffffff;
    box-shadow: 0 1px 0 0 rgba(66, 66, 66, 1);
}

.editorFullScreen span:hover {
    pointer-events: none;
}

.editorFullScreen span {
    color: #e7e7e7;
    background: #202020;
    padding: 10px 20px;
    font-size: 8pt;
    position: fixed;
    z-index: 7;
    cursor: default;
    display: none;
}

.editorFullScreen span::after {
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    border: 10px solid;
    border-color: transparent transparent #202020 transparent;
    top: -19px;
    right: 0;
}

.editorFullScreen:hover span {
    display: block;
}

/******************************************************************************
 *
 * Badge bounce animation
 *
 ******************************************************************************/

@-webkit-keyframes bounceOutUp {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    50% {
        -webkit-transform: translateY(-4px);
        transform: translateY(-4px);
    }

    100% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
    }
}

@keyframes bounceOutUp {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    50% {
        -webkit-transform: translateY(-4px);
        transform: translateY(-4px);
    }

    100% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
    }
}

.bounceOutUp {
    -webkit-animation-name: bounceOutUp;
    animation-name: bounceOutUp;
    -webkit-animation-duration: 0.5s;
    animation-duration: 0.5s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-iteration-count: 2;
    animation-iteration-count: 2;
}

/*********************************************************************************************
 *
 * inDown
 *          is used in org.eclipse.che.ide.ui.loaders.PopupLoaderImpl
 *
 *********************************************************************************************/

@-webkit-keyframes inDown {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-50px);
        transform: translateY(-50px);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

@keyframes inDown {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-50px);
        -ms-transform: translateY(-50px);
        transform: translateY(-50px);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }
}

.inDown {
    -webkit-animation-name: inDown;
    animation-name: inDown;
    -webkit-animation-duration: 0.5s;
    animation-duration: 0.5s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

/*********************************************************************************************
 *
 * outDown
 *          is used in org.eclipse.che.ide.ui.loaders.PopupLoaderImpl
 *
 *********************************************************************************************/

@-webkit-keyframes outDown {
    0% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    100% {
        opacity: 0;
        -webkit-transform: translateY(20px);
        transform: translateY(20px);
    }
}

@keyframes outDown {
    0% {
        opacity: 1;
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }

    100% {
        opacity: 0;
        -webkit-transform: translateY(20px);
        -ms-transform: translateY(20px);
        transform: translateY(20px);
    }
}

.outDown {
    -webkit-animation-name: outDown;
    animation-name: outDown;
    -webkit-animation-duration: 0.5s;
    animation-duration: 0.5s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

.createWsTagsPopup {
    /*the same index as in Window*/
    z-index: 20000;
    border: 1px solid #121416;
    border-radius: 3px;
}

/********************************************************************************************
 *
 * Styled scroll bars
 *
 ********************************************************************************************/

::-webkit-scrollbar {
    width: 7px;
    height: 7px;
}

::-webkit-scrollbar-button {
    width: 0px;
    height: 0px;
    display: none;
}

::-webkit-scrollbar-corner {
    background-color: transparent;
    display: none;
}

::-webkit-resizer {
}

::-webkit-scrollbar-track,
::-webkit-scrollbar-track:hover,
::-webkit-scrollbar-track:active {
    background-color: transparent;
    -webkit-box-shadow: none;
    box-shadow: none;
    border: none;
}

::-webkit-scrollbar-thumb {
    background-clip: padding-box;
    background-color: scrollbarBackgroundColor;
    border: 2px solid transparent;
    border-radius: 4px;
    -webkit-box-shadow: inset 0px 0px 2px scrollbarBorderColor;
    box-shadow: inset 0px 0px 2px scrollbarBorderColor;
    min-height: 32px;
}

::-webkit-scrollbar-thumb:hover {
    background-color: scrollbarHoverBackgroundColor;
}

.found-highlight {
    color: completionPopupItemHighlightTextColor;
}

.found-item {
    white-space: nowrap;
    vertical-align: middle;
    display: inline-block;
    margin-top: -10px;
    font-size: 1em;
    padding-left: 2px;
    padding-left: 4px;
}

.search-match {
    background: findResultsBackground;
    border-radius: 2px;
    padding-right: 2px;
    padding-left: 2px;
    color: findResultsTextColor;
    text-shadow: none;
}
